<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
		<title>Mark My Words</title>
		
		<link href="css/words.css" type="text/css" rel="stylesheet" />
		
		<script src="lib/prototype/prototype.js"></script>
		<script src="lib/domReady.js"></script>
		<script src="lib/scriptaculous/scriptaculous.js" type="text/javascript"></script>
		<script src="lib/scriptaculous/effects.js" type="text/javascript"></script>
		<script src="lib/scriptaculous/dragdrop.js" type="text/javascript"></script>
		<script src="js/words.js" type="text/javascript"></script>
		
	</head>
	
	<body>
		<div id="overlay"></div>
		<div id="selectedDefinition">
			<input id="selectedDefinitionId" type="hidden" value="" />
			<div id="selectedDefinitionWord"></div>
			<div id="selectedDefinitionText"></div>
			<div class="selectedDefinitionQuestion">
				<span class ="questionText">Did you know this word correctly?</span>
				<a id="selectedDefinitionBtnGuessed">Yes</a>
				/
				<a id="selectedDefinitionBtnNotGuessed">No</a>
			</div>
		</div>
		
		<h1>A fun and easy way to learn new words</h1>
		
		<h2 title="Your list of words that you want to learn">Word List</h2>
		<div id="wordList">			
			<div id="wordListItemTemplate" class="wordListItem notDisplayed">
				<img class="progressImg" />
				<a class="word btnShowDefinition" title="Do you know what it means?..."></a>
			</div>
		</div>
		
		<div id="controlPanel">
			<fieldset id="formAddWordDef">
				<legend>Add word to list:</legend>
				
				<label for="txtWord">Word </label><br/>
				<input type="text" id="txtWord" />
				<br />
				<label for="txtDef">Definition </label><br/>
				<textarea id="txtDef"></textarea>
				<input type="button" id="btnAddWord" value="Add" />
			</fieldset>
		</div>
		<br clear="all" />
		
		<h2 title="Drop words here to get rid of them.">Trash Bin</h2>
		<div id="wasteBin">
		  	<span id="wasteItemTemplate" class="wasteItem notDisplayed">
		  	<span class="word"></span>&nbsp;</span>
		</div>
	</body>
</html>
